import React from 'react';
import { Row, Col, Space } from 'antd';
import http from '../../api/index';
import './index.scss';

class index extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            footerDate: {
                data: []
            }
        };

    }
    componentDidMount() {
        http.footer.footList('').then((res) => {
            this.setState((state) => ({
                footerDate: res
            }))
        })
    }

    render() {
        // iconList


        const IconText = ({ icon, text }) => {
            const Icon = require('@ant-design/icons')[icon];
            return (
                <Space>
                    <Icon />
                    {text}
                </Space>
            )
        };

        return (
            <div className="blog-footer">
                <Row>
                    {this.state.footerDate.data.map((title,t_idx) => (
                        <Col xs={24} sm={24} md={8} lg={8} xl={8} key={t_idx}>
                            <div className="blog-footer-item">
                                <div className="footer-title">
                                    <a href={title.footerUrl}>
                                        <IconText icon={title.icon} text={title.footerNm} key={title.footerNm} />
                                    </a>
                                </div>
                                <div className="footer-list">
                                    <ul>
                                        {title.children.map((item,i_idx) => (
                                            <li key={i_idx} >
                                                <a href={item.footerUrl}>
                                                    <IconText icon={item.icon} text={item.footerNm} />
                                                </a>
                                            </li>
                                        ))}
                                    </ul>
                                </div>
                            </div>
                        </Col>
                    ))}
                </Row>
               <div className="footer-info">
                   ©1995-2004 Macromedia, Inc. All rights reserved.
                   <br />
                   xxxx | xxx | xxxx |xxxx | xxx | xxxx | xxxx | xxx | xxxx 
                   </div>
            </div>
        );
    }
}


export default index;